<template>
  <a-card>
    <a-steps :current="current" :items="items" style="width: 50%; margin: auto"></a-steps>
    <StepOne ref="oneRef" v-if="current === 0" @submitSuccess="stepSubmit" />
    <StepTwo ref="twoRef" v-if="current === 1" :formInfo="formInfo" @back="back" @submitSuccess="stepSubmit"/>
    <StepThree ref="threeRef" v-if="current === 2" @goStepOne="goStepOne"/>
  </a-card>
</template>

<script lang="ts" setup>
import StepOne from "./stepOne.vue";
import StepTwo from "./stepTwo.vue";
import StepThree from "./stepThree.vue";
import { ref } from "vue";
const items = [
  {
    title: "填写转账信息",
    description: "",
  },
  {
    title: "确认转账信息",
    subTitle: "",
  },
  {
    title: "完成",
  },
];
const formInfo = ref({})
const current = ref<number>(0);
const stepSubmit = (values: { step: string; params: {}; }) => {
    if(values.step == '1'){
        formInfo.value = values.params
    }
    if(values.step == '2'){
        console.log("支付密码", values.params)
        // formInfo.value = values.params
    } 
    current.value++ 
}
const oldvalues = ref({})
const back = () => {
    current.value--
}
const goStepOne = () => {
    current.value = 0
}
</script>

<style scoped lang="scss"></style>
